<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户主页</title>
</head>

<body>
    <div id="user-info"></div>
    <script>
        // 获取localStorage中的token
        const token = localStorage.getItem('token');
        const userInfoDiv = document.getElementById('user-info');
        getinfo = async function () {
            // 请求info接口
            const response = await fetch('/api/info', {
                headers: {
                    Authorization: `Bearer ${token}`
                }
            });

            const data = await response.json();
            console.log(data);
            if (!response.ok) {

                userInfoDiv.innerHTML = `
                <h2>${data.message}</h2>
                <p>当前用户组被限制</p>
                <p>可尝试使用 admin admin 登录</p>
                <p><a href="/">返回登录</a></p>
                `
                return;
            }
            // 将信息展示在页面中
            userInfoDiv.innerHTML = `
            <h2>欢迎！${data.group}</h2>
            <p>Id: ${data.uid}</p>
            <p>Name: ${data.name}</p>
            <p>Email: ${data.email}</p>
            <p>Age: ${data.age}</p>
            `
        }
        getinfo();
    </script>
</body>

</html>